<template>
	<view class="withdraw">
		<uni-nav-bar left-icon="back" :title="title" fixed="true" @clickLeft="goBack"></uni-nav-bar>
		<view class="drawnum">
			<view class="drawtitle">
				请输入提现金额
				<text>（大约7个工作日内到达账户）</text>
			</view>
			<view class="searchs">
				<text>￥</text>
				<input class="search-input" v-model="amount" placeholder-style="color:#dedede;font-size:28rpx"
					type="digit" placeholder="请输入提现金额" />
			</view>
			<view class="drawrule">
				<text>最低提现额度￥{{money}}</text>
				<text class="record" @click="toList">提现记录</text>
			</view>
		</view>

		<view class="rules" @click="agree = !agree">
			<label class="radio">
				<radio value="选中" color="#EE5531" :checked="agree" style="transform:scale(0.6)" />
			</label>
			请同意
			<text @click.stop="toRules">《{{title}}协议》</text>
		</view>
		<button type="primary" class="operate_btn" @click="userCashWithdrawal">确定</button>
	</view>
</template>

<script>
	import {version} from "@/common/config.js"
	import {
		mapState
	} from 'vuex'
	import {
		userCashWithdrawal,
		quotaInfo
	} from '@/api/my/my.js';
	import copyFunc from "@/utils/userCommon.js";
	export default {
		data() {
			return {
				version: version,
				title: '余额提现',
				agree: true,
				type: 1,
				amount: '',
				money: ''
			}
		},
		computed: {
			...mapState(['userinfo'])
		},
		methods: {
			onShow() {
				this.quotaInfo()
			},
			async quotaInfo() {
				const res = await quotaInfo();
				if (res) {
					if (this.type == 1) {
						this.money = res.data.minMoney;
					} else {
						this.money = res.data.minRedMoney;
					}
				}
			},
			async userCashWithdrawal() {
				if (!this.agree) {
					this.$Toast.none('请阅读并勾选协议')
					return false;
				}
				if (!this.amount) {
					this.$Toast.none('请输入金额')
					return false;
				}
				if (this.userinfo.is_autherized == 0) {
					uni.showModal({
						title: '',
						content: '请先做实名认证',
						cancelText: '取消',
						confirmText: '去认证',
						success: res => {
							if (res.confirm) {
								if(this.version) {
									//  SEARCH 天下竞品
									window.location.href = "http://txjp-test.bjtxjp.com/wap/member/realNameAuthentication.html"
								} else {
									uni.navigateTo({
										url: '/pagesA/my/identification/index'
									})
								}
							}
						}
					})
					return false;
				}
				const res = await userCashWithdrawal({
					amount: this.amount,
					type: this.type
				});
				if (res.code == 200) {
					this.$store.dispatch("updateUserInfo");
					
					this.amount='';
					this.$Toast.none('申请提现成功');
					
				}
			},
			onLoad(e) {
				this.type = e.type;
				if (this.type == 2) {
					this.title = '红包提现'
				}
			},
			// 返回上一页
			goBack() {
				copyFunc.goBack();
			},
			toRules() {
				let type = 3;
				if (this.type == 1) {
					type = 2
				}
				uni.navigateTo({
					url: '/pagesA/my/rules/ruleDetail?type=' + type,
				});
			},
			toList() {
				uni.navigateTo({
					url: `/pagesA/my/account/withdrawlist?type=${this.type}`,
				});
			}
		}
	}
</script>
<style>
	page {
		background-color: #EFF0F1;
	}
</style>
<style lang="scss" scoped>
	@mixin flexLayout($align, $justy) {
		display: flex;
		align-items: $align;
		justify-content: $justy;
	}

	@mixin bck_img($url) {
		background: url($url) no-repeat;
		background-size: 100% 100%;
	}

	@mixin cards {
		box-sizing: border-box;
		width: 94%;
		margin: 20rpx 3%;
		background: #FFFFFF;
		border-radius: 24rpx;
		padding: 36rpx 36rpx;
	}

	.withdraw {
		box-sizing: border-box;
		height: 465rpx;
		@include bck_img($img-link+'/my/balance-bg.png');
		padding-top: 88rpx;
		color: #5E5E5E;

		/deep/ .uni-navbar__header,
		/deep/ .uni-navbar__content,
		/deep/ .uni-icons,
		/deep/ .uni-nav-bar-text {
			background-color: transparent !important;
			color: #FFFFFF !important;
		}

		/deep/ .uni-navbar--border {
			border-bottom-color: transparent !important;
		}

		.drawnum {
			@include cards;

			.drawtitle {
				color: #5E5E5E;
				font-size: 28rpx;
				margin-bottom: 80rpx;

				text {
					font-size: 24rpx;
				}
			}

			.searchs {
				@include flexLayout(center, flex-start);
				border-bottom: 1px solid #EFEFEF;
				padding-bottom: 20rpx;
				margin-bottom: 30rpx;

				.search-input {
					margin-left: 20rpx;
					color: #FC4654;
					font-size: 40rpx;
				}

				.uni-input-placeholder {
					color: #dedede;
					font-size: 28rpx;
				}

				text {
					color: #1B1B1B;
				}
			}

			.drawrule {
				@include flexLayout(center, space-between);
				font-size: 24rpx;

				.record {
					color: #84B065;
				}
			}
		}

		.operate_btn {
			width: 76%;
			margin: 240rpx 12%;
			background: linear-gradient(360deg, #EE4629 0%, #EE653A 100%);
			box-shadow: 0px 20rpx 36rpx 0px rgba(238, 73, 43, 0.25);
			border-radius: 42rpx;
		}

		.rules {
			margin: 20rpx 4%;
			color: #383838;
			font-size: 24rpx;

			text {
				color: #EE5732;
			}
		}

		/deep/ uni-radio .uni-radio-input.uni-radio-input-checked:before {
			color: #EE5531;
			font-size: 44rpx;
		}

		/deep/ uni-radio .uni-radio-input {
			border: 2px solid #B7B7B7;
		}

		/deep/ uni-radio .uni-radio-input-checked {
			background-color: #ecd1c9 !important;
			border: 2px solid #EE5531;
		}
	}
	// #ifdef H5
	.withdraw {
		padding-top: 44rpx !important;
	}
	// #endif

	.placeholder-input {
		color: #dedede;
		font-size: 28rpx;
	}
</style>
